<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport"
        content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>迭代器自定义遍历对象</title>
</head>
<body>
  <script>
    //声明一个对象
    const banji = {
      name: '终极一班',
      stus: [
        'xiaoming',
        'xiaoning',
        'xiaotian',
        'knight',
      ],
      [Symbol.iterator] () {
        // 索引变量
        let index = 0
        // 改变this指向
        let _this = this
        return {
          next: function () {   // 这里可以改成箭头函数，这样this就指向 banji 了
            if (index < _this.stus.length) {
              const result = { value: _this.stus[index], done: false }
              // 索引变量自增
              index++
              // 返回结果
              return result
            } else {
              return { value: undefined, done: true }
            }
          },
        }
      },

      /**  用箭头函数
       * [Symbol.iterator] () {
       *         let index = 0
       *         return {
       *           next: () => {
       *             if (index < this.stus.length) {
       *               const result = { value: this.stus[index], done: false }
       *               index++
       *               return result
       *             } else {
       *               return { value: undefined, done: true }
       *             }
       *           },
       *         }
       *       }
       * */
    }
    for (let k of banji) {
      console.log(k)
    }
  </script>
</body>
</html>